import { theme } from "@/settings/designSetting";
import { setLocalStorage } from "@/utils";

const { darkTheme, appTheme, appThemeDetail } = theme;

const designStore = {
  namespaced: true,
  state: {
    // 是否暗黑
    darkTheme,
    // 主题名称
    themeName: (darkTheme && "dark") || "light",
    // 颜色色号
    appTheme,
    appThemeDetail,
  },
  getters: {
    darkTheme: (state) => state.darkTheme,
    appTheme: (state) => state.appTheme,
    appThemeDetail: (state) => state.appThemeDetail,
  },
  actions: {
    // 切换主题
    changeTheme() {
      this.darkTheme = !this.darkTheme;
      this.themeName = this.darkTheme ? "dark" : "light";
      setLocalStorage("LOWCODE_DESIGN", this.$state);
    },
    // 设置颜色
    setAppColor(color) {
      this.appTheme = color.hex;
      this.appThemeDetail = color;
      setLocalStorage("LOWCODE_DESIGN", this.$state);
    },
  },
};

export default designStore;
